<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>数据类型</title>
    <script>
        function f1(){
            let num = 1;
            console.log(typeof num);
            let name = "admin";
            console.log(typeof(name));
            let flag = true;
            console.log(typeof flag);
            num = 3.14;
            console.log(typeof num);
        }

        function f2(){
            let name;
            console.log(name); //undefined
            name = null;
            console.log(name);
            name = NaN;
            console.log(name); // NaN:Not a Number
            let num = "admin";
            num = parseInt(num);
            console.log(num);
        }

        function f3(){
            let obj = new Object();
            console.log(typeof obj);

            let date = new Date();
            console.log(date);
            console.log(typeof date);

            let arr = [1,2,3];
            console.log(arr);
            console.log(typeof arr);
        }

        function f4(){
            // 表示将fn所对应的函数整体赋值给变量f1
            // 此时的f1是一个函数类型
            // 此时不会执行fn方法
            let f1 = fn;
            // alert(f1);
            console.log(typeof f1);

            // 带括号表示执行对应函数
            f1();
            console.log("----------------")


            // 表示将fn函数的返回值赋值给变量f2
            // 此时的f2的类型与fn返回值类型一致
            // 此处会执行fn方法
            let f2 = fn();
            // alert(f2)
            console.log(typeof f2);
        }

        function fn(){
            console.log("这是fn函数");
            return "fn";
        }

        function f5(){
            let f1 = function(){
                console.log("这是一个函数");
            };
            console.log(typeof f1);
            f1();
        }
    </script>
</head>
<body>
<button onclick="f1()">基本数据类型</button><br>
<button onclick="f2()">非正常类型</button><br>
<button onclick="f3()">复合数据类型</button><br>
<button onclick="f4()">函数类型</button><br>
<button onclick="f5()">函数类型</button><br>
</body>
</html>